// 精选题型的弹框
<template>
  <div class="container"><el-dialog
  title="题目预览"
  :visible.sync="dialogVisible.isShow"
    >
  <div>
      <span>【题型】:{{nowDetilequestion.questionType===1?'单选':(nowDetilequestion.questionType===2?'多选':'简答')}}</span>
      <span>【编号】:{{nowDetilequestion.id}}</span>
      <span>【难度】:{{nowDetilequestion.difficulty===1?'简单':(nowDetilequestion.difficulty===2?'一般':'困难')}}</span>
      <span>【学科】:{{nowDetilequestion.subject}}</span>
      <span>【目录】:{{nowDetilequestion.catalog}}</span>
      <span>【方向】:{{nowDetilequestion.direction}}</span>

  </div>
  <hr>
  <div>
      【题干】：<div v-html="nowDetilequestion.question"></div>
     <div></div>
     <div>{{}}选项:（以下选中的选项为正确答案）</div>
  </div>
  <hr>
  <div>【参考答案】<el-button type="danger" @click="isvudioshow()">视频预览</el-button></div>
  <video :src="nowDetilequestion.videoURL" v-if="isvideo" width="300px" height="300px" ref="myvideo" controls></video>
  <hr>
  <div><span>【答案解析】：</span><span v-html="nowDetilequestion.answer"></span></div>
  <hr>
  <div><span>【题目备注】：</span><span>{{nowDetilequestion.remarks}}</span></div>
  <template #footer></template>
  <span class="dialog-footer">
    <el-button type="primary" @click="dialogVisible.isShow = false">关闭</el-button>
  </span>
</el-dialog></div>
</template>

<script>
export default {
  props: {
    dialogVisible: {
      type: Object,
      default () {
        return {}
      }
    },
    nowDetilequestion: {
      type: Object,
      default () {
        return {

        }
      }
    }
  },
  data () {
    return {
      isvideo: false,
      videoSrc: ''
    }
  },
  methods: {
    isvudioshow () {
      this.isvideo = true
    }
  }
}
</script>

<style scoped lang='scss'>
.container{
    position: relative;
}
.dialog-footer{
    position: absolute;
    right: 10px;
    bottom: 10px;

}

</style>
